<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
<%@ include file="/view/common/init.jsp"%>
<title>Cảnh báo</title>
<script type="text/javascript" src="<c:out value="${pageContext.request.contextPath}"/>/js/filter.js"></script>
<script type="text/javascript">
	var countryId = <c:out value="${countryId}"/>;
	var areaId = <c:out value="${areaId}"/>;
	var provinceId = <c:out value="${provinceId}"/>;
	var cellId = <c:out value="${cellId}"/>;
	window.onload = function() {
		new Ajax.Request(base_url + 'agent/cellList.do', {
			method : 'post',
			onSuccess : function(transport) {
				var data = transport.responseText.evalJSON();
				// Init Countries combo
				pushValueToCountryCombo(data.countries);
				
				// Init Area combo
				pushValueToAreaCombo(data.areas);
				
				// Init Province combo
				pushValueToProvinceCombo(data.provinces);	
				
				// Init cell combo
				pushValueToCellCombo(data.agents);
			},
			onFailure : function() {
				alert('Something went wrong...')
			}
		});
	};
	
</script>
<s:form action="alert.do" method="get">
<center>
	<div class="header">CÁC CẢNH BÁO</div>
	<div id="comboChoose">
		<div class="item">
			<select name="countryId" id="comboCountry" onchange="filterCountry();" style="width: 130px;">
				<option value="0">--Chọn quốc gia--</option>
			</select>
		</div>
		<div class="item">
			<select name="areaId" id="comboArea" onchange="filterArea();" style="width: 130px;">
				<option value="0">----Chọn miền----</option>
			</select>
		</div>
		<div class="item">
			<select name="provinceId" id="comboProvince" onchange="filterProvince();" style="width: 130px;">
				<option value="0">----Chọn tỉnh----</option>
			</select>
		</div>
		<div class="item">
			<select name="cellId" id="comboCell" style="width: 130px;">
				<option value="0">----Chọn Cell----</option>
			</select>
		</div>
	</div>
	<div class="clear-both"><span></span></div>
	<div id="comboChooseType" style="width: 600px;">
		<div class="item">
			Thông tin cảnh báo 
		</div>
		<div class="item" style="width: 300px;">
			<select name="typeAlert" id="comboType" style="width: 300px;">
				<option>Thông tin</option>
		        <option 
		        <c:if test="${typeAlert=='noActivity' }">selected="selected"</c:if> 
		       		value="noActivity">Thuê bao không hoạt động</option>
		       	<option
		       	<c:if test="${typeAlert=='noCallGenerated' }">selected="selected"</c:if> 
		      	 	value="noCallGenerated">Thuê bao hoạt động, không phát sinh cuộc gọi</option>
		        <option 
		        	<c:if test="${typeAlert=='changeServingCell' }">selected="selected"</c:if>
		        value="changeServingCell">Thuê bao thay đổi serving cell</option>
		        <option
		        	<c:if test="${typeAlert=='useWeakRx' }">selected="selected"</c:if> 
		        	value="useWeakRx">Thuê bao sử dụng sóng yếu</option>
		        <option 
		        	<c:if test="${typeAlert=='useWeakRxQuality' }">selected="selected"</c:if>
		        	value="useWeakRxQuality">Thuê bao sử dụng sóng có chất lượng tồi</option>
		        <option
		        	<c:if test="${typeAlert=='lowCsr' }">selected="selected"</c:if> 
		        	value="lowCsr">Thuê bao có tỷ lệ CSR thấp</option>
			</select>
		</div>
		<div class="item">
			<button>Chọn</button>
		</div>
	</div>
	<div class="clear-both"><span></span></div>	
	<div class="header" style="margin-top: 50px;">
		<c:if test="${empty typeAlert}">CÁC THUÊ BAO</c:if>
		<c:if test="${typeAlert=='noActivity' }">CÁC THUÊ BAO KHÔNG HOẠT ĐỘNG</c:if>
   		<c:if test="${typeAlert=='noCallGenerated' }">CÁC THUÊ BAO HOẠT ĐỘNG, KHÔNG PHÁT SINH CUỘC GỌI</c:if> 
     	<c:if test="${typeAlert=='changeServingCell' }">CÁC THUÊ BAO THAY ĐỔI SERVING CELL</c:if>
     	<c:if test="${typeAlert=='useWeakRx' }">CÁC THUÊ BAO SỬ DỤNG SÓNG YẾU</c:if> 
     	<c:if test="${typeAlert=='useWeakRxQuality' }">CÁC THUÊ BAO SỬ DỤNG SÓNG CÓ CHẤT LƯỢNG TỒI</c:if>
     	<c:if test="${typeAlert=='lowCsr' }">CÁC THUÊ BAO CÓ TỶ LỆ CSR THẤP</c:if> 
	</div>
	<div class="clear-both"><span></span></div>	
	<div style="width: 740px;">
	<c:if test='${end != "0"}'> 
		<div style="width: 100%;margin-bottom: 10px;text-align: right;width: 720px;">
			<c:choose>  
				<c:when test='${start != end}'>  
					Bản ghi thứ <c:out value="${start}"/> đến <c:out value="${end}"/>&nbsp;
				</c:when>  
				<c:otherwise>  
					Bản ghi thứ <c:out value="${start}"/>&nbsp;
				</c:otherwise> 
			</c:choose>	 
			trong tổng số <c:out value="${total}"/> bản ghi &nbsp;&nbsp;&nbsp;
			<c:if test='${page != "1"}'> 
				<input type="image" onclick="$('page').value=parseInt($('page').value)-1;return true;" src="<c:out value="${pageContext.request.contextPath}"/>/image/first.png">&nbsp;&nbsp;
			</c:if>
			<c:if test='${pageNum != 1}'>
				<input id="page" readonly="readonly" type="text" name="page" style="width: 30px;text-align: center;" value="<c:out value="${page}"/>">&nbsp;&nbsp;
			</c:if>
			<c:if test='${page != pageNum}'> 
				<input type="image" onclick="$('page').value=parseInt($('page').value)+1;return true;"  src="<c:out value="${pageContext.request.contextPath}"/>/image/last.png">
			</c:if>
		</div>
	</c:if>	
		<table class="tbl_info" style="width: 720px;">
			<tr>
				<td class="hed">ID</td>
				<td class="hed">Họ tên chủ thuê bao</td>
				<td class="hed">Số điện thoại</td>
				<td class="hed">Ghi chú</td>
			</tr>
      		<c:forEach var="agent" items="${agentAlerts}" varStatus="rowCounter">
				<tr>
					<td><c:out value="${agent.agentId}" /></td>
					<td>${agent.customerId}</td>
					<td>${agent.msisdn}</td>
					<td><a href="<c:out value="${pageContext.request.contextPath}"/>/agent/detail.do?agent.agentId=<c:out value="${agent.agentId}"/>">Chi tiết</a></td>
				</tr>      		
      		</c:forEach>			
		</table>
	</div>
</center>
</s:form>